<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="layout" content="bocMain"/>
    <title>进件作业系统</title>
</head>

<body>

<header class="header-title">配偶信息</header>

<div>
    <input type="hidden" id="token">
    <div class="photoFrame" id="Positive">
        <div class="photo-item ">
            <img src="" alt="" class="imgUrl" id="idcardPositiveImg">
            <input class="weui-input" type="file" name="idcardPositive" capture="camera" accept="image/*" id="idcardPositive">
            <div class="input-box">
                <asset:image src="/boc/photo.png" alt=""/>
                <h5>点击拍摄/上传人像面</h5>
            </div>
        </div>
    </div>

    <div class="photoFrame " id="Negative">
        <div class="photo-item ">
            <img src="" alt="" class="imgUrl" id="idcardNegativeImg">
            <input class="weui-input" type="file" name="idcardNegative" capture="camera" accept="image/*" id="idcardNegative">
            <div class="input-box">
                <asset:image src="/boc/photo.png" alt=""/>
                <h5>点击拍摄/上传国徽面</h5>
            </div>
        </div>
    </div>

    <g:form action="spouseIdentityVerificationSave" class="myForm">
        <input type="hidden" id="id" name="id" value="${this?.opportunity?.id}">
        <input type="hidden" id="idcardPositiveUrl" name="idcardPositiveUrl">
        <input type="hidden" id="idcardNegativeUrl" name="idcardNegativeUrl">

        <div class="weui-cells weui-cells_form">

            <div class="weui-cell">
                <div class="weui-cell__hd"><label class="weui-label">姓名</label></div>
                <div class="weui-cell__bd">
                    <g:textField class="weui-input" id="fullName" name="fullName"  placeholder="姓名"></g:textField>
                </div>
            </div>
            <div class="weui-cell">
                <div class="weui-cell__hd"><label class="weui-label">性别</label></div>

                <div class="weui-cell__bd">
                    <g:textField class="weui-input" id="gender" name="gender" placeholder="性别"></g:textField>
                </div>
            </div>
            <div class="weui-cell">
                <div class="weui-cell__hd"><label class="weui-label">民族</label></div>

                <div class="weui-cell__bd">
                    <g:textField class="weui-input" id="nation" name="nation" placeholder="民族"></g:textField>
                </div>
            </div>
            <div class="weui-cell">
                <div class="weui-cell__hd"><label class="weui-label">出生日期</label></div>

                <div class="weui-cell__bd">
                    <g:textField class="weui-input" name="birthday" placeholder="出生日期" id="birthday"></g:textField>
                </div>
            </div>
            <div class="weui-cell">
                <div class="weui-cell__hd"><label class="weui-label">住址</label></div>
                <div class="weui-cell__bd">
                    <textArea class="weui-textarea autoheighTextArea" name="nativePlace" id="nativePlace" placeholder="住址"></textArea>
                </div>
            </div>
            <div class="weui-cell">
                <div class="weui-cell__hd"><label class="weui-label">身份证号</label></div>
                <div class="weui-cell__bd">
                    <input type="text" class="weui-input" id="idNumber" name="idNumber" placeholder="身份证号"/>
                </div>
            </div>
            <div class="weui-cell ">
                <div class="weui-cell__hd"><label class="weui-label" >证件有效期</label></div>
                <div class="weui-cell__bd">
                    <g:textField class="weui-input" name="periodOfValidity" id="periodOfValidity" placeholder="证件有效期"></g:textField>
                </div>
            </div>
            <div class="weui-cell">
                <div class="weui-cell__hd"><label class="weui-label">签发机关</label></div>
                <div class="weui-cell__bd">
                    <g:textField class="weui-input" id="authority" name="authority"  placeholder="签发机关"></g:textField>
                </div>
            </div>

            <g:textField class="weui-input hide" id="maritalStatus" name="maritalStatus" value="已婚"></g:textField>
        </div>

    </g:form>

    <div class="bigBtn">
        <button class="weui-btn weui-btn_primary" id="submit">下一步</button>
    </div>
</div>
<asset:javascript src="boc/textAutoHeight.js"/>

<script>
    $(function ()
    {
        // 使用
        $('textarea').autoHeight();
        function helpMessage(message) {
            $(".helpMsg").text(message).fadeIn(200);
            setTimeout(function () {
                $(".helpMsg").fadeOut(200);
            }, 2000);
        }

        function getUploadToken() {
            var token = ""
            $.ajax({
                type: "POST",
                url: "/attachments/getUploadToken2",
                async: false,
                success: function (data) {
                    if (data.status == "success") {
                        token = data.token;
                        console.log("getUploadToken success.");
                    }
                },
            });
            return token
        }

        function getRandom(length) {
            var str = Math.random().toString(36).substr(2);
            if (str.length >= length) {
                return str.substr(0, length);
            }
            str += getRandom(length - str.length);
            return str;
        }

        function getKey() {
            var timestamp = (new Date()).valueOf();
            return timestamp + '.jpg'
        }

        function periodOfValidityValidate(periodOfValidity) 
        {
            var flag = false
            var dateBegin = new Date(periodOfValidity.replace(/-/g, "/"));
            var dateDiff = dateBegin.getTime() - new Date().getTime();
            var dayDiff = Math.floor(dateDiff / (24 * 3600 * 1000));
            if (dayDiff > 31) 
            {
                flag = true
            }
            return flag
        }

        $("#submit").click(
            function () {
                var idcardPositiveUrl = $("#idcardPositiveUrl").val();
                var idcardNegativeUrl = $("#idcardNegativeUrl").val();
                if (idcardPositiveUrl == "" || idcardPositiveUrl == undefined) {
                    helpMessage("请拍摄身份证正面照片");
                    return
                }
                if (idcardNegativeUrl == "" || idcardNegativeUrl == undefined) {
                    helpMessage("请拍摄身份证反面照片");
                    return
                }
                var fullName = $("#fullName").val();
                if (!fullName)
                {
                    helpMessage("请输入姓名");
                    return
                }
                var idNumber = $("#idNumber").val();
                if (!idNumber)
                {
                    helpMessage("请输入身份证号");
                    return
                }
                if (idNumber.length > 18 || idNumber.length < 15)
                {
                    helpMessage("请输入正确的身份证号");
                    return
                }
                var birthday = $("#birthday").val();
                if (!birthday)
                {
                    helpMessage("请输入出生日期");
                    return
                }
                if (!/^\d{4}年\d{1,2}月\d{1,2}日$/.test(birthday))
                {
                    helpMessage("出生日期格式不正确（例：*年*月*日）");
                    return
                }
                var nativePlace = $("#nativePlace").val();
                if (!nativePlace)
                {
                    helpMessage("请输入住址");
                    return
                }
                var periodOfValidity = $("#periodOfValidity").val();
                if (!periodOfValidity)
                {
                    helpMessage("请输入证件有效期");
                    return
                }
                var periodOfValidityStr = periodOfValidity.split('-')[1]
                if (periodOfValidityStr) 
                {
                    periodOfValidityStr = periodOfValidityStr.substring(0,4) + '-' + periodOfValidityStr.substring(5,7) + '-' + periodOfValidityStr.substring(8,10)
                }
                var flag = periodOfValidityValidate(periodOfValidityStr)
                if (!flag) 
                {
                    helpMessage("请您更换身份证后再申请，谢谢！");
                    return
                }
                var authority = $("#authority").val();
                if (!authority)
                {
                    helpMessage("请输入签发机关");
                    return
                }

                $(".myForm").submit();
            }
        )

        var Qiniu_upload = function (f, token, key, name) {
            var Qiniu_UploadUrl = "https://upload-z1.qiniup.com";
            var xhr = new XMLHttpRequest();
            xhr.open('POST', Qiniu_UploadUrl, true);
            var formData = new FormData();
            formData.append('key', key);
            formData.append('token', token);
            formData.append('file', f);
            xhr.onreadystatechange = function (response) {
                if (xhr.readyState == 4 && xhr.status == 200 && xhr.responseText != "") {
                    var blkRet = JSON.parse(xhr.responseText);
                    console.log(blkRet);
                    $("#idcard" + name + "Url").val(blkRet.key);
                    $("#idcard" + name + "Img").attr("src", "https://quickloanfs.cindata.cn/" + blkRet.key);
                } else if (xhr.status != 200 && xhr.responseText) {
                    var blkRet = JSON.parse(xhr.responseText);
                    console.log(blkRet);
                }
            };
            xhr.send(formData);
        };

        $('#idcardPositive').change(function (e) {
            var file = e.target.files[0];
            var formData = new FormData();
            formData.append("component", "身份证识别验证");
            formData.append('file', file);
            $.ajax({
                method: "POST",
                url: "/bocAppOpportunity/ajaxEvaluateComponent",
                data: formData,
                contentType: false,
                processData: false,
                cache:false,
                success: function (data) {
                    if (data.error_code == "0")
                    {
                        console.log(data);
                        if(data.type == "第二代身份证")
                        {
                            $("#fullName").val(data.name);
                            $("#gender").val(data.sex);
                            $("#nation").val(data.people);
                            $("#idNumber").val(data.id_number);
                            if (/^\d{4}年\d{1,2}月\d{1,2}日$/.test(data.birthday))
                            {
                                $("#birthday").val(data.birthday);
                            }
                            $("#nativePlace").val(data.address);
                            $('textarea').autoHeight();
                        }
                        else if(data.type == "第二代身份证背面")
                        {
                            $("#periodOfValidity").val(data.validity);
                            $("#authority").val(data.issue_authority);
                        }
                    }
                    else
                    {
                        helpMessage("身份证识别失败，请重新上传");
                        return;
                    }
                },
                error: function (jqXHR) {
                    console.log(JSON.stringify(jqXHR));
                }
            });

            // if (file.size > 1024 * 1024 * 10 + 100) {
            //     helpMessage("图片大于10M，请修改后上传");
            //     return;
            // }
            var token = getUploadToken()
            var key = getRandom(28) + file.name.substr(file.name.lastIndexOf('.'))
            Qiniu_upload(file, token, key, "Positive")
        });

        $('#idcardNegative').change(function (e) {
            var file = e.target.files[0];
            var formData = new FormData();
            formData.append("component", "身份证识别验证");
            formData.append('file', file);
            $.ajax({
                method: "POST",
                url: "/bocAppOpportunity/ajaxEvaluateComponent",
                data: formData,
                contentType: false, // 注意这里应设为false
                processData: false,
                cache:false,
                success: function (data) {
                    if (data.error_code == "0")
                    {
                        console.log(data);
                        if(data.type == "第二代身份证")
                        {
                            $("#fullName").val(data.name);
                            $("#gender").val(data.sex);
                            $("#nation").val(data.people);
                            $("#idNumber").val(data.id_number);
                            if (/^\d{4}年\d{1,2}月\d{1,2}日$/.test(data.birthday))
                            {
                                $("#birthday").val(data.birthday);
                            }
                            $("#nativePlace").val(data.address);
                            $('textarea').autoHeight();
                        }
                        else if(data.type == "第二代身份证背面")
                        {
                            $("#periodOfValidity").val(data.validity);
                            $("#authority").val(data.issue_authority);
                        }
                    }
                    else
                    {
                        helpMessage("身份证识别失败，请重新上传");
                        return;
                    }
                },
                error: function (jqXHR) {
                    console.log(JSON.stringify(jqXHR));
                }
            });

            // if (file.size > 1024 * 1024 * 10 + 100) {
            //     helpMessage("图片大于10M，请修改后上传");
            //     return;
            // }
            var token = getUploadToken()
            var key = getRandom(28) + file.name.substr(file.name.lastIndexOf('.'))
            Qiniu_upload(file, token, key, "Negative")
        });
    });

</script>
</body>
</html>